<template>
    <div>
        <div class="nmh">
            <van-icon name="arrow-left" @click="$router.go(-1)"/>
            <h3>拜访详情</h3>
               <van-icon name="home-o" />
        </div>
        <div class="nmbp">
               <div class="lp">
                   <img src="../../assets/头像男 拷贝 4.png" alt="">
                   <div>
                  <span>刘圣书</span>
                  <span>录入人:</span>
                   </div>
                   
                </div> 
               
        </div>
        <div class="biaodan">
                   <div class="biaodan-p">
                       <img src="../../assets/基本信息.png" alt="">
                       <span>基本信息</span>
                   </div>
                   <ul>
                    <li>
                      <span>客户名称:</span>  
                        </li>
                     <li><span>拜访标题:</span></li>
                     <li><span>拜访时间:</span></li>
                     <li><span>拜访地址:</span></li>
                     <li><span>拜访原因:</span></li>
                     <li><span>竞争信息收集情况:</span></li>
                     <li><span>创建时间:</span></li>
                    
                   </ul>
        </div>
    </div>
</template>

<script>
import  {GetviSitDate} from "@/request/api"
export default {
    name: 'Visitdetails',
    data () {
        return {
            id:"",
         listData:null
        }
    },
    methods:{
            biaji(id){
                this.$router.push( `/Thecustomertoedit/${id}`)
            }
    },
    created(){
        GetviSitDate({id:this.$route.params.id}).then((res)=>{
            this.listData=res.data.data
            console.log("获取走访信息详情接口数据:",res);
        })
    }
}
</script>
 
<style lang = "less" scoped>
    .nmh{
        font-size: .14rem;
        display: flex;
        height: .5rem;
        align-items: center;
        background: #073796;
        color: white;
        .van-icon{
            width: .5rem;
        }
        h3{
            flex: 1;
            text-align: center;
        }
    }
    .nmbp{
           height: 1.5rem;
    background: #073796;
    display: flex;
    font-size: 0.14rem;
    color: white;
    /* justify-content: space-around; */
    justify-content: space-between;
    align-items: center;
    .rp{
         width: 0.9rem;
    height: .3rem;
    line-height: .3rem;
    /* text-align: right; */
    display: flex;
    justify-content: flex-end;
    align-items: center;
    /* background: #003399; */
    background: rgba(0, 0, 0, .3);
    border-top-left-radius: .1rem;
    border-bottom-left-radius: .1rem;
    }
         .lp{
             flex: 1;
             display: flex;
             align-items: center;
                 padding-left: .25rem;
                 span{
                     margin-left: .2rem;
                 }
             img{
                 width: 1rem;
                 height: 1rem;
             }
             div{
                 span{
                     display: block;
                     height: .3rem;
    line-height: .3rem;
                 }
             }
         }
    }
    .biaodan{
        font-size: .14rem;
        background: #fff;
        ul{
            padding: 0 .3rem;
            li{
                height: .3rem;
                line-height: .3rem;
            }
        }
        .biaodan-p{
            display: flex;
            align-items: center;
            height: .6rem;
            padding: 0 .3rem;
            span{
                margin-left: .15rem;
            }
        }
    }
</style>